<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="/css/newshare.css" />
<script type="text/javascript" src="/admins/js/jquery/jquery-1.7.2.min.js"></script>
<style type="text/css">
.yanhuobottom{height:1500px;margin-top:130px;}
.yanhuobottom li{line-height:24px;color:#666;padding-left:20px;}
.yanhuobottom .yanhuolv{color:#393;font-weight:bold;}
.yanhuobottom .yanhuored{color:#f90;font-weight:bold;}
.yanhuobox{padding:5px 20px;}
.yanhuobox h2{font-size:16px;font-weight:bold;line-height:20px;}
.yanhuobox p{font-size:14px;color:#999;line-height:20px;height:22px;}
.yanhuobox input{padding:5px 5px;background:#fff;border:#ddd solid 1px;width:100%;}
.yanhuofh{height:45px;background:#333;position:relative;z-index:1;}
.yanhuofh h2{position:absolute;top:0;left:0;right:0;text-align:center;color:#fff;font-size:14px;line-height:45px;z-index:1;}
.yanhuofh a{
color: #fff;
height:30px;width:80px;text-align:center;line-height:30px;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,.3);
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.3);
box-shadow: 0 1px 0 rgba(255,255,255,.3);float:left;border: 1px solid #111;
background: #333;
font-weight: 700;border-radius:20px;margin:5px 0 0 20px;cursor:pointer;
z-index:2;position:absolute;
}
</style>
</head>
<body>
<div style="position:fixed;height:95px;background:#f3f3f3;top:0;left:0;right:0;border-bottom:#ddd solid 1px;">
	<div class="yanhuofh">
    	<a href="javascript:goback();">返回</a>
        <h2>验货出库</h2>        
    </div>
    <div class="yanhuobox">    
    <?php if($this->billall): ?>
    	<h2><span id="billno"><?php echo $this->billall->billNo;?></span> <span id="status-text">正在验货中</span></h2>
        <p><span id="ok-count">0</span>/<span><?php echo count($this->storedetail) ?></span></p>
	<?php else: ?>
    	<?php if($this->query != ''): ?>
        <h2>无效条码</h2>
        <?php else: ?>
        <h2>请扫描运单号</h2>
        <?php endif; ?>
    <?php endif; ?>
    	<input id="brcode" name="brcode" placeholder="请输入条形码" type="text" />
    </div>
</div>
<div class="yanhuobottom">
	<ul id="wait-list">    	        
        <?php if(isset($this->storedetail) && $this->storedetail != null && count($this->storedetail) > 0): ?>
         
       	<?php foreach ($this->storedetail as $Item): ?>        
       		<li class="normal"><?php echo $Item->barcode ?></li>
        <?php endforeach; ?>
        <?php endif; ?> 
    </ul>
</div>
<script type="text/javascript">
function checkItem(brcode) {
	if ($("#wait-list li").length > 0) {
	  var isFind = false;
	  $("#wait-list li.normal").each(function(index, element) {
		  if ($(element).text() == brcode) {
			  oksound();
			  if ($("#wait-list li").length == 1) {
				  $(element).removeClass('normal').addClass('yanhuolv');
			  } else {
				   if ($("#wait-list li.yanhuored").length == 0) {
					   if (index + 1 < $("#wait-list li").length) {
							$(element).insertAfter("#wait-list li.normal:last");
					   }
				   } else {
						$(element).insertBefore("#wait-list li.yanhuored"); 
						$("#wait-list li.yanhuored").removeClass('yanhuored').addClass('yanhuolv');	
				   }
				   $(element).removeClass('normal').addClass('yanhuored');				   
			  }			  
			  isFind = true;
			  $("#ok-count").text(parseInt($("#ok-count").text()) + 1);
			  movebar(brcode);
			  return;
		  }
	  });	
	  if ($("#wait-list li.normal").length == 0) {
		  $.post("/admini/managewaybill/pdacheck", { brcode: $("#billno").text() }, function(data){
			  if (data == 1) {
				  $("#status-text").text("检货完成");
				  $("#wait-list").empty();
				  $(".yanhuobox h2").css('color', '#060');
				  showmp3();
			  }
		  });			
	  } else {
		  if (!isFind) {
			  if (!isChecked(brcode)) {
			  	scanerr();
			  }
		  }	
	  }
	}
	showfocus();
}

function isChecked(brcode) {
	var result = false;
	if ($("#wait-list li.yanhuored").text() == brcode) {
		return true;
	}
	$("#wait-list li.yanhuolv").each(function(index, element) {
		if ($(element).text() == brcode) {
			result = true;
			return;
		};
	});
	return result;
}

function movebar() {	
	h1 = $(document).height();
	h2= $(window).height();
	h3 = $("#wait-list li.yanhuored").offset().top;	
	if (h3 > h2) {
		$(document).scrollTop(h3 - h2/2);
	} else {
		$(document).scrollTop(15);
	}
}

function getWaylbill(brcode) {
	if ($.trim(brcode) != '') {
		window.location = '/admini/managewaybill/pdacheck/brcode/' + brcode;
	}
}

function showfocus(){
  $("#brcode").val("");
  $("#brcode").focus();
  $("#brcode").css('imeMode', 'auto');
}
 
//$("#brcode").focus();
showfocus();

$(document).ready(function(){ 
   $('#brcode').focus().keyup(function(e){
		if(e.keyCode === 13){
		   var brcode = $("#brcode").val();
		   var re = /^\d+$/;
		   if (re.test(brcode)) {
			   checkItem(brcode);
		   } else {		             
			  getWaylbill(brcode);			
		   }
	   }
   }).blur(function(){
	   $('#brcode').focus();
   });
});
     
function showmp3(){
    var audio = document.createElement('audio');
    audio.src = '/images/storage/success.mp3?rnd'+Math.random();//这里放音乐的地址
    audio.autoplay = 'autoplay';
    document.body.appendChild(audio);
}

function scanerr(){
    var audio = document.createElement('audio');
    audio.src = '/images/storage/xuxushishi.mp3?rnd'+Math.random();
    audio.autoplay = 'autoplay';
    document.body.appendChild(audio);
    setTimeout("showfocus()",1000);
}

function oksound(){
    var audio = document.createElement('audio');
    audio.src = '/images/storage/go.mp3?rnd'+Math.random();//这里放音乐的地址
    audio.autoplay = 'autoplay';
    document.body.appendChild(audio);
	setTimeout("showfocus()",1000);
}

function goback(){
    location.href='/admini/managelogin/tabletlist';
}
</script>
</body>
</html>